前言

topology.js函式庫，在Three.js建立三角網格拓樸關係可以使用topology.js來建立，但是目前作者 Lee Stemkoski 沒有繼續更新為Module，函數本身也有些許小問題，因此筆者稍微將原本的函式庫修正在這邊提供給大家。

Three.js三角網格拓樸

topology.js函式庫使用起來非常簡單，首先要由筆者的github下載topology.js函式庫，接著建議將topology.js放到threecad/client/common目錄下，因為topology.js也可能被其他程式重用:
https://github.com/QQBoxy/threecad/blob/master/client/common/topology.js

由於STLLoader回傳的是BufferGeometry，要先將幾何轉為可供編輯的Geometry型態，因此我們在Viewer的add函數加入轉換函數。

var geometry = new THREE.Geometry().fromBufferGeometry(bufferGeometry);

最後就可以使用TOPOLOGY中的createFromGeometry函數建立拓樸關係，如下圖:

var topology = new TOPOLOGY.createFromGeometry(geometry);
console.log(topology);

從圖片上可以看到，topology.js 函式庫所提供的拓樸關係有三種 vertex 、edge 、face ，分別就是 點拓樸、邊拓樸、面拓樸，其內建的拓樸資訊已經非常實用。

範例原始碼

https://github.com/QQBoxy/threecad/blob/master/client/example8/Viewer.js

附註

稍微說明一下筆者對於 topology.js 修正的部分:

1. remove - 函數最尾數的計算問題，此問題為筆者過去實驗室的友人所發現並修正。
2. var - 函數未進行宣告問題，部分的變數沒有設定好會導致Webpack包裝失敗。
3. THREE - 過去建立 three.js 的方式是直接在html原始碼透過script標籤進行引入，而現在採用 module 的方式後並不會被引用進來，因此需要添加對 three 的依賴。

import * as THREE from 'three';

4. module - 模組化拓樸函式庫，在現代的前端程式設計中，模組化已經是相當重要的一環，常見的 three.js 相關函式庫也都有做模組化的設計。

module.exports = TOPOLOGY;

後記

透過topology.js函式庫可以很簡單的創建拓樸結構，不過topology.js也並不是非常完整，如果還需要更完整的拓樸關係，可以再自行修改函式庫唷。